<!-- 我的订阅 -->
<template>
    <div class="orderDom">
      <el-dialog title="查看详情" :visible.sync="dialogExamine" width="1100px" top="6%">
        <div style="padding: 10px;">
          <div class="iframeFalse map" style="width: 100%" v-if="customizedParams.showType != 3">
            <wizMap v-if="dialogExamine" ref="wizmapMe4" mapId="mapid4" ></wizMap>
            <!-- <img src="../../assets/image/222.png" alt="" width="100%"> -->
          </div>
          <dataViewInfo ref="refDataView"></dataViewInfo>
        </div>
      </el-dialog>
      <!-- <el-progress :precentage="50" ></el-progress> -->
      <el-dialog title="文件列表" :visible.sync="dialogDownload" width="60%">
        <!-- <el-form :inline="true" :model="currentRow" class="demo-form-inline-box">
          <el-form-item label="IP地址">
            {{ currentRow.ipaddr }}
          </el-form-item>
          <el-form-item label="端口号">
            {{ currentRow.protno }}
          </el-form-item>
          <el-form-item label="路径">
            {{ currentRow.url }}
          </el-form-item>
          <br />
          <el-form-item label="账号">
            {{ currentRow.account }}
          </el-form-item>
          <el-form-item label="密码">
            {{ currentRow.password }}
          </el-form-item>
        </el-form> -->
        <el-table
          v-loading="tableLoading"
          :data="fileList"
          stripe
          style="width: 100%"
        >
          <el-table-column prop="date" label="日期"> </el-table-column>
          <el-table-column prop="product" label="产品"> </el-table-column>
          <el-table-column prop="frequency" label="时次"> </el-table-column>
          <el-table-column prop="startime" label="开始时间"> </el-table-column>
          <el-table-column prop="endtime" label="结束时间"> </el-table-column>
          <el-table-column prop="size" label="数据容量"> </el-table-column>
          <el-table-column prop="state" label="传输状态">
            <template slot-scope="scope">
              {{ scope.row.state == 1 ? "传输成功" : "传输失败" }}
            </template>
          </el-table-column>
  
          <el-table-column label="操作" width="80">
            <template slot-scope="scope">
              <el-button
                type="success"
                @click="handleCopy(scope.row)"
                size="small"
                >下载</el-button
              >
            </template>
          </el-table-column>
        </el-table>
        <span slot="footer" class="dialog-footer">
          <el-button @click="dialogDownload = false">关 闭</el-button>
          <!-- <el-button type="primary" @click="handleCopy">复制信息</el-button> -->
        </span>
      </el-dialog>

      <!-- <div style="font-size: 18px; color: #000; padding-bottom: 10px;"> 此订单需由贵部业务机关部门审核并函提XXXXXXXXXX</div> -->
      <el-tabs v-model="activeName" @tab-click="handleTabsClick">
        <el-tab-pane
          label="进行中"
          name="orderProgress"
        ></el-tab-pane>
        <el-tab-pane
          label="历史订单"
          name="orderHistory"
        ></el-tab-pane>
     
      </el-tabs>
      <div class="formDom">
        <el-form :inline="true" :model="formInline" class="demo-form-inline">
            <el-form-item label="订单方式">
                <el-select v-model="formInline.datatype" placeholder="请选择">
                    <el-option label="全部" value=""> </el-option>
                    <el-option label="军综网" :value="1"> </el-option>
                    <el-option label="指挥专网" :value="2"> </el-option>
                </el-select>
            </el-form-item>
          <el-form-item label="订单编号">
            <el-input v-model="formInline.no" placeholder="订单编号"></el-input>
          </el-form-item>
          <el-form-item label="数据名称">
            <el-input
              v-model="formInline.filename"
              placeholder="资料名称"
            ></el-input>
          </el-form-item>
          <el-form-item>
            <div class="flex">
              <el-button type="primary" @click="onSearch">查询</el-button>
              <el-button type="info" @click="onReset">重置</el-button>
              <el-button type="primary" @click="onExcel" v-if="isadmin == 1">导出</el-button>
              <!-- <el-upload
                class="upload-demo"
                style="margin-left: 10px;"
                action="#"
                :on-progress="onImport"
                :limit="1"
                :show-file-list="false"
                accept=".xls,.xlsx"
                v-if="isadmin == 1"
                >
                <el-button type="primary">导入</el-button>
              </el-upload> -->
            </div>
            <!-- <el-button type="primary" @click="onImport">导入</el-button> -->
          </el-form-item>
        </el-form>
      </div>
      <div class="tableDom">
        <el-table
          v-loading="tableLoading"
          :data="tableData"
          stripe
          style="width: 100%"
        >
          <el-table-column type="index" label="序号" width="80" align="left"> </el-table-column>
          <el-table-column prop="no" label="订单编号" width="220"> </el-table-column>
          <el-table-column prop="type" label="订单方式" width="110">
            <template slot-scope="scope">
              {{ scope.row.datatype == 2 ? "指挥专网" : "" }}
              {{ scope.row.datatype == 1 ? "军综网" : "" }}
            </template>
          </el-table-column>
          <el-table-column prop="filename" label="数据名称" width="180"> </el-table-column>
          <el-table-column prop="scope" label="订单范围"> 
             <template slot-scope="scope">
                <div v-if="scope.row.scope.length > 40">
                  <!-- <el-tooltip effect="dark" placement="top-end"  >
                    <div slot="content"> -->
                        <!-- <div v-for="(item, index) in scope.row.scope.split(',')" :key="index">{{ item }}</div> -->
                    <!-- </div> -->
                    <div style="width: 350px; text-overflow: ellipsis;  white-space: nowrap; overflow: hidden;">{{ scope.row.scope }}</div>
                  <!-- </el-tooltip> -->
                </div>
                <div v-else>
                  {{ scope.row.scope }}
                </div>
            </template>
            <!-- <template slot-scope="scope">
                <div v-if="scope.row.type == 1">
                  <div>东经112°-125°</div>
                  <div>北纬21°-36°</div>
                </div>
                <div v-else>
                  {{ scope.row.username }}
                </div>
            </template> -->
          </el-table-column>
          <el-table-column prop="timetype" label="订阅时间" width='150'> 
            <template slot-scope="scope">
                <div v-if="scope.row.timetype == 2">
                  <div>{{ scope.row.startime}}</div>
                  <div>{{ scope.row.endtime}}</div>
                </div>
                <div v-else> 长期</div>
            </template>
          </el-table-column>
          <el-table-column prop="updatetime" width="200" label="订单时间" :formatter="$changeTime.createTimeFn"> </el-table-column>
          <el-table-column label="订单状态" width="130">
            <template slot-scope="scope">
              <!-- @ApiModelProperty(value = "状态 1未提交 2进行中 3停止订单", name = "state", example = "Integer") -->
              <el-tag type="warning" v-if="scope.row.state == 1">未提交</el-tag>
              <el-tag type="success" v-if="scope.row.state == 2">进行中</el-tag>
              <el-tag type="danger" v-if="scope.row.state == 3">已停止</el-tag>
            </template>
          </el-table-column>
          <el-table-column label="操作" width="220">
            <template slot-scope="scope">
                <!-- <div v-if="scope.row.state == 4">
                    <el-button type="text" size="small" @click="handleShow(scope.row)"> 编辑订阅 </el-button>
                    <el-button type="text" size="small" @click="handleDelete(scope.row)"> 删除 </el-button>
                </div> -->
                <div v-if="scope.row.state == 2 && formInline.state == 1">
                    <el-button type="text" size="small" @click="handleShow(scope.row)"> 查看详情 </el-button>
                    <el-button type="text" size="small" @click="stopClick(scope.row, 3)"> 停止订阅 </el-button>
                    <el-button type="text" size="small" @click="downloadClick(scope.row)"> 下载数据 </el-button>
                </div>
                <div v-if="scope.row.state == 3 && formInline.state == 1">
                    <el-button type="text" size="small" @click="stopClick(scope.row, 2)"> 启用订阅 </el-button>
                    <el-button type="text" size="small" @click="handleDelete(scope.row)"> 删除 </el-button>
                </div>
                <div v-if="scope.row.state == 3 && formInline.state == 2">
                    <el-button type="text" size="small" @click="handleDelete(scope.row)"> 删除 </el-button>
                </div>
            </template>
          </el-table-column>
        </el-table>
      </div>
      <ComPagination
        :total="total"
        :currentPage="formInline.pageNum"
        :pageSize="formInline.pageSize"
        @current-change="handleCurrentChange"
        @size-change="handleSizeChange"
      ></ComPagination>
      <!-- <div v-show="activeName == 'orderProgress'"></div>
      <div v-show="activeName == 'orderHistory'"></div> -->
  
        <!-- <el-dialog title="地图框选" :visible.sync="dialogListInfo" width="75%" top="10px"  :before-close="handleClose">
          <div>
            <mapData ref="mapDataRef1" mapId="mapId3"></mapData>
          </div>
            <span slot="footer">
              <div style="text-align: end;border-top: 1px solid #ddd;padding-top: 20px;">
                  <el-button size="small" type="primary" @click="dialogListInfo = false">确 定</el-button>
              </div>
            </span>
        </el-dialog> -->
          <el-dialog title="下载数据" :visible.sync="dialogListxiazai" width="1200px" top="5%"  :before-close="handleClose">
              <div style="padding: 0 20px 20px 20px; height: 650px;">
                <el-table v-loading="tableLoading" :data="downloadList" height="620px" stripe  style="width: 100%"  >
                    <el-table-column type="index" label="序号" width="50" align="center"> </el-table-column>
                    <el-table-column prop="datananme" label="数据名称" >
                      <template slot-scope="scope">
                        <template  v-if="scope.row.datananme.length > 13">
                          <el-tooltip effect="dark" :content="scope.row.datananme" placement="top-start">
                              <div style="width: 200px; text-wrap: nowrap;text-overflow: ellipsis;overflow: hidden;">{{ scope.row.datananme }}</div>
                          </el-tooltip>
                        </template>
                        <template slot-scope="scope" v-else>
                            <span>{{ scope.row.datananme }}</span>
                        </template>
                      </template>
                    </el-table-column>
                    <!-- <el-table-column prop="datatime" label="数据日期" width="120"> </el-table-column> -->
                    <el-table-column prop="createtime" label="生成日期" :formatter="$changeTime.createTimeFn" > </el-table-column>
                    <el-table-column prop="filesize" label="文件大小"  > </el-table-column>
                    <el-table-column prop="filename" label="文件名" width="300"> </el-table-column>
                    <el-table-column prop="format" label="文件格式" width="100" align="center"> </el-table-column>
                    <el-table-column label="操作" width="100">
                      <template slot-scope="scope">
                          <div style="position: relative;">
                            <el-button type="text" size="small" @click="xiazaiDownload(scope.row, scope.$index)"> 下载 </el-button>
                            <el-progress v-show="scope.row.precentageNum"  :percentage="scope.row.precentageNum" style="width: 100%;position: absolute; bottom: -8px; z-index: 9;"></el-progress>
                          </div>
                        </template>
                    </el-table-column>
                </el-table>
              </div>
          </el-dialog>
    </div>
  </template>
  
  <script>
  import ComPagination from "@/components/comPagination.vue";
  // import myCustomization from "@/views/myCustomization/index.vue";
  import dataViewInfo from "@/components/dataView.vue";
  import wizMap from "@/components/wizMap/wizMap.vue";

  
  export default {
    components: {
      ComPagination,
      dataViewInfo,
      wizMap,
    },
    data() {
      return {
        tableLoading: false,
        dialogDownload: false,
        dialogExamine: false,
        dialogListxiazai: false,
        dialogListInfo: false,
        dialogExamineStatus: false,
        precentageStatus: false,
        viewParams: {},
        precentage1: 0,
  
        activeName: "orderProgress",
        viewType: 'view',
        total: 0,
        userid: sessionStorage.getItem('userid'),
        isadmin: sessionStorage.getItem('isadmin'), // 1 超级管理员 2 普通管理员
        currentRow: {},
        formInline: {
          datatype: '',
          state: 1, //1进行中 2历史订单 3已停止
          no: "",
          filename: "",
          isexamine: 0,
          pageNum: 1,
          pageSize: 10,
          userid: '',
        },
        formFile: '',
        formIsexamine: { examineview: "", isexamine: 1 },
        customizedParams:{
          showType: '1'
        },
        tableData: [
          // {
          //   datatype: "1",
          //   no: "234324320191893",
          //   endtime: "长期",
          //   filename: "全国地面逐小时观测",
          //   username: '东部战区',
          //   timeDate: '2024年12月21日',
          //   state: 4,
          // },
          // {
          //   datatype: "1",
          //   no: "234324320191891",
          //   type: 1,
          //   endtime: "2024年12月21日~2025年12月31日",
          //   filename: "无缝隙智能网格数据",
          //   username: '东经112°-125°  北纬21°-36°',
          //   timeDate: '2024年12月21日',
          //   state: 2,
          // },
          // {
          //   datatype: "1",
          //   no: "234324320191891",
          //   endtime: "长期",
          //   filename: "全国雷达基数据",
          //   username: '福建省（8站点）',
          //   timeDate: '2024年12月21日',
          //   state: 2,
          // },
          // {
          //   datatype: "1",
          //   no: "234324320191891",
          //   endtime: "-",
          //   filename: "全国1:100万基础地理信息数据（2021）",
          //   username: 'F50, G49, G50, G51 H49, H50,H51, I50,I51',
          //   timeDate: '2024年12月21日',
          //   state: 1,
          // },
       
        
        ],
        fileList: [],
        downloadList: [
          // {
          //   no: "全国地面逐小时观测",
          //   no1: "2024-12-21 12:00",
          //   no2: "2024-12-21 12:23",
          //   no3: "120K",
          //   no4: "Surf202412211200.dat",
          //   no5: "BUFR",
          // },
          // {
          //   no: "全国地面逐小时观测",
          //   no1: "2024-12-21 11:00",
          //   no2: "2024-12-21 11:21",
          //   no3: "136K",
          //   no4: "Surf202412211200.dat",
          //   no5: "BUFR",
          // },
          // {
          //   no: "全国地面逐小时观测",
          //   no1: "2024-12-21 10:00",
          //   no2: "2024-12-21 10:13",
          //   no3: "141K",
          //   no4: "Surf202412211200.dat",
          //   no5: "BUFR",
          // },
          // {
          //   no: "全国地面逐小时观测",
          //   no1: "2024-12-21 9:00",
          //   no2: "2024-12-21 9:20",
          //   no3: "122K",
          //   no4: "Surf202412211200.dat",
          //   no5: "BUFR",
          // },
          // {
          //   no: "全国地面逐小时观测",
          //   no1: "2024-12-21 8:00",
          //   no2: "2024-12-21 8:23",
          //   no3: "152K",
          //   no4: "Surf202412211200.dat",
          //   no5: "BUFR",
          // },
        ],
      };
    },
    created() {
      this.onSearch();
      this.userid = sessionStorage.getItem("userid");
      this.isadmin = sessionStorage.getItem("isadmin");
    //   console.log(this.isadmin);
      
    },
    methods: {
      onSearch() {
        this.formInline.userid = this.userid;
        this.tableLoading = true;
        this.tableData = [];
        this.$http.post(`/fileOrder/list`, this.formInline).then((res) => {
            this.tableLoading = false;
            if (res.code == 200) {
              this.tableData = res.data.records || [];
            
              this.total = res.data.total || 0;
            } else {
              this.$message.error(res.message);
            }
          })
          .catch((err) => {
            this.tableLoading = false;
            this.$message.error(err.message);
          });
      },
      onReset() {
        this.formInline = {
            datatype: '',
            state: 1,
            no: "",
            filename: "",
            isexamine: 0,
            pageNum: 1,
            pageSize: 10,
            userid: this.userid,
        };
        this.onSearch();
      },
      // 导出
      onExcel() {
        this.formInline.userid = sessionStorage.getItem("userid");
        this.$http.postFile(`/fileOrder/list/excel`, this.formInline).then((res) => {
            if (res.status == 200) {
                let data = res.data
                let blob = new Blob([data], {type: 'application/vnd.ms-excel;charset=utf-8'})
                let fileName = decodeURI(res.headers['content-disposition'])
                // console.log(fileName);
                // saveAs(blob, `${fileName}.xlsx`);

                if (typeof window.navigator.msSaveBlob !== 'undefined') {
                    // 兼容IE，window.navigator.msSaveBlob：以本地方式保存文件
                    window.navigator.msSaveBlob(blob, `${fileName}`)
                } else {
                    // 创建新的URL并指向File对象或者Blob对象的地址
                    const blobURL = window.URL.createObjectURL(blob)
                    // 创建a标签，用于跳转至下载链接
                    const tempLink = document.createElement('a')
                    tempLink.style.display = 'none'
                    tempLink.href = blobURL
                    tempLink.setAttribute('download', `${fileName}`)
                    // 兼容：某些浏览器不支持HTML5的download属性
                    if (typeof tempLink.download === 'undefined') {
                        tempLink.setAttribute('target', '_blank')
                    }
                    // 挂载a标签
                    document.body.appendChild(tempLink)
                    tempLink.click()
                    document.body.removeChild(tempLink)
                    // 释放blob URL地址
                    window.URL.revokeObjectURL(blobURL)
                }
            } else {
              this.$message.error(res.message);
            }
          })
          .catch((err) => {
            this.$message.error(err.message);
          });
      },
      // // 导入
      // onImport(event, file, fileList) {
      //   // this.formInline.userid = sessionStorage.getItem("userid");
      //   let data = new FormData();
      //   data.append("file", file.raw);
      //   this.$http.post(`/fileOrder/save/excel`, data).then((res) => {
      //       if (res.code == 200) {
      //         this.$message.success(res.message);
      //         this.formInline.pageNum = 1;
      //         this.onSearch();
      //       } else {
      //         this.$message.error(res.message);
      //       }
      //     })
      //     .catch((err) => {
      //       this.$message.error(err.message);
      //     });
      // },
      handleTabsClick(tab, event) {
        console.log(tab, event);
        if (this.activeName == 'orderProgress'){
          this.formInline.state = 1;
        } else if (this.activeName == 'orderHistory'){
          this.formInline.state = 2;
        }
        this.onSearch();
      },
      // 下载清单
      downloadClick(row, index){
        // this.precentageStatus = true
        // setInterval(() => {
        //   if ( this.precentage1 >= 100) {
        //     // this.precentageStatus = false
        //     return;
        //   }
        //   this.precentage1 = this.precentage1 + 50
        // }, 800)

          this.dialogListxiazai = true;
          this.$http.post(`/dataDetail/list?orderid=${row.id}`,).then((res) => {
             if (res.code == 200) {
               let data = res.data.records || [];
               this.downloadList = data.map(item => {
                  return {
                    ...item,
                    precentageNum: 0,
                  }
              })
             } else {
               this.$message.error(res.message);
             }
          })
      },
      xiazaiDownload(row, index){
        let _this = this
        let precentageNum = 5
        this.downloadList[index].precentageNum = precentageNum
        let times = setInterval(() => {
          if (precentageNum < 20){
              precentageNum += 5
              this.downloadList[index].precentageNum = precentageNum
          }
        },800)
        this.$http.postFile(`/dataDetail/data?id=${row.id}`,).then((res) => {
          console.log(res, 'postFile');
          clearInterval(times)
          if (res.data.size == 0){
            this.downloadList[index].precentageNum = 0 
            this.$message.error('没有该文件');

            return;
          }
            precentageNum = 20
            this.downloadList[index].precentageNum = precentageNum
            if (res.status == 200) {
                let data = res.data
                let blob = new Blob([data], {type: 'application/vnd.ms-excel;charset=utf-8'})
                let fileName = decodeURI(res.headers['content-disposition'])
                let fileName1 = fileName.split('=')[1] || '订阅数据'
                // console.log(fileName);
                // saveAs(blob, `${fileName}.xlsx`);
                
                if (typeof window.navigator.msSaveBlob !== 'undefined') {
                    // 兼容IE，window.navigator.msSaveBlob：以本地方式保存文件
                    window.navigator.msSaveBlob(blob, `${fileName1}`)
                } else {
                    // 创建新的URL并指向File对象或者Blob对象的地址
                    const blobURL = window.URL.createObjectURL(blob)
                    // 创建a标签，用于跳转至下载链接
                    const tempLink = document.createElement('a')
                    tempLink.style.display = 'none'
                    tempLink.href = blobURL
                    tempLink.setAttribute('download', `${fileName1}`)
                    // 兼容：某些浏览器不支持HTML5的download属性
                    if (typeof tempLink.download === 'undefined') {
                        tempLink.setAttribute('target', '_blank')
                    }
                    // 挂载a标签
                    document.body.appendChild(tempLink)
                    tempLink.click()
                    // tempLink.setAttribute('onprogress', (e) => {
                    //     console.log(e, '1111111');
                        
                    // })
                    // console.log(tempLink, '2222222');
                    document.body.removeChild(tempLink)
                    // 释放blob URL地址
                    window.URL.revokeObjectURL(blobURL)
                  }
                  precentageNum = 100
                  this.downloadList[index].precentageNum = precentageNum
                  setTimeout(() => {
                    this.$message.success('下载成功')
                    this.downloadList[index].precentageNum = 0 // 关闭进度条
                  },800)
                  // let times1 = setInterval(() => {
                  //   if (precentageNum < 100){
                  //       // precentageNum += Math.floor((Math.random() * (40 - 30)) + 30)
                  //       precentageNum = 100
                  //       if (precentageNum > 100) precentageNum = 100
                  //       this.downloadList[index].precentageNum = precentageNum
                  //   }
                   
                  //   if (precentageNum >= 100){
                  //     clearInterval(times1)
                  //     this.$message.success('下载成功');
                  //     setTimeout(() => {
                  //       this.downloadList[index].precentageNum = 0 // 关闭进度条
                  //     },500)
                  //   }
                  // },800)
                
            } else {
              this.downloadList = this.downloadList[index].precentageNum = 0
              this.$message.error(res.message);
            }
        }).catch((err) => {
            this.tableLoading = false;
            this.$message.error(err.message);
        });
      },
      handleShow(row) {
        // this.viewType = 'view'
        this.dialogExamine = true;
        let  data = {...row}
        data.jsonDate = JSON.parse(data.jsonDate)
        data.showType = data.jsonDate.showType
        this.customizedParams.showType = data.showType
        console.log(data, '=========row');
        
        let obj = {
          mapView: [[105, 36], 3],
          isShowPane: true,
          // dataView: this.dataView,
          paneType: 1,
          showtype: data.showType || '1',
          jwdfw: [
            [140, 0],
            [70, 0],
            [70, 60],
            [140, 60],
          ],
          bakView: data.jsonDate.mapPosition
        }
        this.$nextTick(() => {
            // console.log(this.$refs.myCustomizationRef);
              this.$refs.refDataView.initParams(data);
              if (data.showType != 3){
                this.$refs.wizmapMe4.mapData = obj
              }
        })
      },

      handleDelete(row){
        this.$confirm('是否删除该文件?', '提示', {
            confirmButtonText: '确定',
            cancelButtonText: '取消',
            type: 'warning'
        }).then(() => {
            this.$http .post(`/fileOrder/delete?id=${row.id}`).then((res) => {
                if (res.code == 200) {
                  this.onSearch();
                  this.$message.success('删除成功');
                } else {
                  this.$message.error(res.message);
                }
            }) .catch((err) => {
                this.tableLoading = false;
                this.$message.error(err.message);
            });
        }).catch(() => {});
      },
      handleCopy() {
        this.$message({
          type: "success",
          message: "复制成功",
        });
      },
      //停止订阅
      stopClick(row, status){
        let title = status == 2 ? '是否启用该订阅' : '是否停止该订阅';
        this.$confirm(title, '提示', {
            confirmButtonText: '确定',
            cancelButtonText: '取消',
            type: 'warning'
        }).then(() => {
            this.$http.post(`/fileOrder/update`, {id: row.id, state: status}).then((res) => {
                if (res.code == 200) {
                  this.onSearch();
                  this.$message.success('停止订阅成功');
                } else {
                  this.$message.error(res.message);
                }
            }).catch((err) => {
                this.tableLoading = false;
                this.$message.error(err.message);
            });
        }).catch(() => {});
      },
      // 分页
      handleCurrentChange(page) {
        this.formInline.pageNum = page;
        this.onSearch();
      },
      handleSizeChange(size) {
        this.formInline.pageSize = size;
        this.onSearch();
      },
      handleClose() {
        this.dialogListInfo = false;
        this.dialogExamineStatus = false;
        this.dialogListxiazai = false;
      },
    },
  };
  </script>
  
  <style lang="scss" scoped>
  .map {
    width: 350px;
    height: 300px;
    position: relative;
    .full-screen {
      position: absolute;
      bottom: 10px;
      right: 10px;
      font-size: 12px;
      z-index: 9;
      background-color: #e7e7e7;
      padding: 5px 10px;
      color: #377ffd;
      display: flex;
      align-items: center;
      cursor: pointer;
    }
    .site-list {
      width: auto;
      padding: 10px;
      margin-bottom: 3px;
      background-color: #f3f8fc;
    }
  }
  .iframeFalse {
    width: 350px;
    height: 300px;
  }
  ::v-deep .el-progress__text{
    font-size: 12.4px !important;
  }
  ::v-deep .el-progress-bar{
    padding-right: 40px;
    margin-right: -45px;
  }
  .orderDom {
    height: 100%;
    background-color: #fff;
    padding: 20px;
    ::v-deep .el-table .cell{
      overflow: visible;
    }
    ::v-deep .el-dialog__wrapper {
      // .el-dialog__header {
      //   background-image: linear-gradient(
      //     to right,
      //     #89b7fb,
      //     #b1c7fc,
      //     #d1d8fc,
      //     #ebebfd,
      //     #ffffff
      //   );
      // }
      .el-dialog__header{
          padding: 10px;
          background-image: url(../../../public/image/dialog-head.png);
          background-size: 100% 100%;
          .el-dialog__title{
            color:#000;
    
          }
        }
        .el-dialog__body{
          padding: 0 10px;
        }
      .dialog-border {
        border-top: 2px solid #409eff;
        margin-bottom: 10px;
      }
      .dialog-footer {
      }
    }
    ::v-deep .demo-form-inline-box {
      background-color: #f8f8f8;
      padding: 10px 10px 0 10px;
      font-size: 16px;
      .el-form-item__label {
        font-weight: bold;
        color: dodgerblue;
      }
    }
    ::v-deep .demo-form-mini {
      .el-form-item {
        margin-bottom: 0 !important;
      }
      .el-form-item__label {
        font-weight: bold;
      }
      .radio-isexamine {
        .el-radio__inner {
          border: 1px solid dodgerblue;
        }
        .el-radio__label {
          font-size: 16px;
          color: #000;
        }
      }
    }
  }
  </style>
  